<template>
	<div>
		<Card class="content-card">
			<Tabs :animated="false">
				<ButtonGroup slot="extra">
					<Button type="primary" size="small" icon="md-refresh" @click="refreshData"></Button>
				</ButtonGroup>
				<TabPane label="二手车列表" name="secondCar">
					<div style="margin-bottom:10px;">
						类型 <Select v-model="params.typeId" style="width:200px;margin-left: 5px;">
							<Option v-for="(i,index) in catTypeList" :key="index" :value="i.typeId" >
								{{i.typeName}}
							</Option>
						</Select>
						品牌 <Select v-model="params.brandId" style="width:200px;margin-left: 5px">
							<Option v-for="(item,index) in catBrandList" :key="index" :value="item.brandId" >
								{{item.brandName}}
							</Option>
						</Select>
						<Button @click="refreshData" type="primary">查询</Button>
					</div>
					<table-view ref="tableView" :tableCol='tableCol' :params='params' :requestUrl='requestUrl'></table-view>
				</TabPane>
			</Tabs>
		</Card>
	</div>
</template>

<script>
	import tableView from '../../components/table'
	import {
		formatDate
	} from '../utils/time.js'
	export default {
		components: {
			tableView
		},
		data() {
			return {
				catTypeList: [],
				catBrandList:[],
				requestUrl: 'old/car/release/query/list',
				tableCol: [{
						title: '序号',
						type: 'index',
						width: 70
					}, {
						title: '车辆',
						minWidth: 180,
						render: (h, params) => {
							return h('div', [
								h('img', {
									attrs: {
										src: params.row.carPhoto
									},
									style: {
										width: "80px",
										height: "80px",
										margin: "5px"
									}
								}),
								h('div', {
										style: {
											display: "inline-block",
											margin: "50px 0 0 10px",
											position: "absolute"
										}
									},
									params.row.carName),
							])
						}
					}, {
						title: '类型',
						key: 'typeName',
						minWidth: 180
					}, {
						title: '品牌',
						key: 'brandName',
						minWidth: 150
					}, {
						title: '单价(万元)',
						minWidth: 80,
						key: 'carMoney'
					}, {
						title: '成色',
						minWidth: 80,
						key: 'fewInto',
						render: (h, params) => {
							return h('div', params.row.fewInto + "成新")
						}
					}, {
						title: '发布日期',
						minWidth: 80,
						key: 'createTime',
						render: (h, params) => {
							return h('div', formatDate(new Date(params.row.createTime), 'yyyy-MM-dd hh:mm'))
						}
					}, {
						title: '操作',
						key: 'action',
						minWidth: 200,
						render: (h, params) => {
							return h('div', [
								h('Button', {
									props: {
										type: 'error',
										size: 'small'
									},
									on: {
										click: () => {
											this.$Modal.confirm({
												title: '删除？',
												content: '确定要删除吗？删除不可恢复',
												onOk: () => {
													this.$http.post('old/car/release/delete', {
														id: params.row.secondId
													}).then(res => {
														if (res.status == 200) {
															this.$refs['tableView'].getData()
															this.$Notice.warning({
																title: '删除成功'

															});
														}
													})
												}
											})
										}
									}
								}, '删除'),
								h('Button', {
									props: {
										type: 'primary',
										size: 'small'
									},
									style: {
										marginLeft: '10px'
									},
									on: {
										click: () => {

											this.$router.push(`/oldCarDetail/${params.row.secondId}`)

										}
									}
								}, '查看')
							])
						}
					}

				],
				params: {
					pageNo: 1,
					pageSize: 10,
					highest: '',
					typeId: '',
					brandId: '',
					Lowest: ''
				},
				modalType: ''
			}
		},
		mounted() {
			// 查询车辆类型列表
			this.queryCarTypeList();
			//查询品牌列表
			this.queryCarBrandList();
		},
		methods: {
			refreshData() {
				this.$refs['tableView'].getData()
			},
			operationDone() {
				this.$refs['tableView'].getData()
			},
			queryCarTypeList() {
				this.$http.post('/cartype/list', {
					pageNo: '1',
					pageSize: '100000'
				}).then(res => {
					if (res.status == 200) {
						if (res.data.code == 200) {
							this.catTypeList = res.data.data.rows;
						}

					}
				});
			},
			queryCarBrandList() {
				this.$http.post('/brand/list').then(res => {
					if (res.status == 200) {
						if (res.data.code == 200) {
							this.catBrandList = res.data.data;
						}
			
					}
				});
			}
		}
	}
</script>
<style scoped>

</style>
